var uploadedDataURL = "/asset/get/s/data-1564540466051-uuFvrLo5R.json";

//  垃圾站
var gubageArr = [
  {
    name: "五零四文化广场",
    value: [103.503623, 36.153077, 120],
    type: "laji",
  },
  {
    name: "中海广场",
    value: [103.695645, 36.11699, 80],
    type: "laji",
  },
  {
    name: "安宁科教城",
    value: [103.731721, 36.105152, 100],
    type: "laji",
  },
  {
    name: "东立开泰园",
    value: [103.695286, 36.087304, 120],
    type: "laji",
  },
  {
    name: "金色家园",
    value: [103.652598, 36.101478, 120],
    type: "laji",
  },
  {
    name: "区粮库家属楼",
    value: [103.666037, 36.089579, 120],
    type: "laji",
  },
  {
    name: "二零五小区",
    value: [103.743004, 36.072369, 120],
    type: "laji",
  },
  {
    name: "三十七家园",
    value: [103.877534, 36.042433, 120],
    type: "laji",
  },
  {
    name: "丰和丽园",
    value: [103.913969, 36.048561, 120],
    type: "laji",
  },
  {
    name: "银河国际居住区",
    value: [103.902687, 36.091387, 120],
    type: "laji",
  },

  {
    name: "新泰家园",
    value: [103.273235, 36.733072, 120],
    type: "laji",
  },
  {
    name: "良吉小区",
    value: [103.265545, 36.746434, 120],
    type: "laji",
  },
  {
    name: "尚城天河家园",
    value: [103.95257, 36.333868, 120],
    type: "laji",
  },
  {
    name: "建德大厦",
    value: [103.960762, 36.322761, 120],
    type: "laji",
  },
  {
    name: "华光小区",
    value: [104.118127, 35.862134, 120],
    type: "laji",
  },
  {
    name: "教育花园",
    value: [104.128188, 35.84306, 120],
    type: "laji",
  },
];
// 管网
var guanwang = [
  {
    name: "万达广场",
    value: [103.869701, 36.069802, 120],
    type: "guanwang",
  },
  {
    name: "兰州碧桂园",
    value: [103.913538, 36.111567, 120],
    type: "guanwang",
  },
  {
    name: "人民公园",
    value: [103.26806, 36.727982, 120],
    type: "guanwang",
  },
  {
    name: "五里墩小学",
    value: [103.251244, 36.764187, 120],
    type: "guanwang",
  },
  {
    name: "马圈岭",
    value: [103.169606, 36.795405, 120],
    type: "guanwang",
  },
  {
    name: "临平小学",
    value: [103.138417, 36.693611, 120],
    type: "guanwang",
  },
  {
    name: "大掌岭",
    value: [103.050455, 36.624128, 120],
    type: "guanwang",
  },
  {
    name: "茨盖岭",
    value: [103.392817, 36.629573, 120],
    type: "guanwang",
  },
  {
    name: "高庙岭",
    value: [103.332451, 36.418435, 120],
    type: "guanwang",
  },
  {
    name: "卧牛山",
    value: [103.494577, 36.535445, 120],
    type: "guanwang",
  },
  {
    name: "杨家湾大岭",
    value: [102.988364, 36.491355, 120],
    type: "guanwang",
  },
  {
    name: "包家尖岭",
    value: [103.142441, 36.441201, 120],
    type: "guanwang",
  },
];
var lvdi = [
  {
    name: "甘肃警察职业学院",
    value: [103.995724, 36.375113, 120],
    type: "lvdi",
  },
  {
    name: "包家尖岭",
    value: [103.144834, 36.441487, 120],
    type: "lvdi",
  },
  {
    name: "兰州现代职业技术学院",
    value: [103.770908, 36.553294, 120],
    type: "lvdi",
  },
  {
    name: "黑石川工业园",
    value: [103.937059, 36.493432, 120],
    type: "lvdi",
  },
  {
    name: "兴隆滨河苑",
    value: [103.899617, 36.073678, 120],
    type: "lvdi",
  },
  {
    name: "甘肃银行",
    value: [103.959828, 36.327762, 120],
    type: "lvdi",
  },
  {
    name: "西庄",
    value: [103.972422, 36.278142, 120],
    type: "lvdi",
  },
];

// 燃气
var ranqi = [
  {
    name: "红古广场",
    value: [102.871468, 36.355351, 120],
    type: "ranqi",
  },
  {
    name: "桌子湾",
    value: [102.943763, 36.375811, 120],
    type: "ranqi",
  },
  {
    name: "西固小区",
    value: [103.630985, 36.129567, 120],
    type: "ranqi",
  },
  {
    name: "王官营小学",
    value: [103.724265, 36.023034, 120],
    type: "ranqi",
  },
  {
    name: "甘肃省博物馆",
    value: [103.782277, 36.072479, 120],
    type: "ranqi",
  },
  {
    name: "恒大翡翠华庭",
    value: [103.724426, 36.068453, 120],
    type: "ranqi",
  },
  {
    name: "景家庄",
    value: [104.11094, 35.832819, 120],
    type: "ranqi",
  },
  {
    name: "范家营",
    value: [104.22578, 35.914066, 120],
    type: "ranqi",
  },
  {
    name: "谷地岔",
    value: [103.930974, 36.332851, 120],
    type: "ranqi",
  },
];

var jinggai = [
  {
    name: "兰石新区家园",
    value: [103.690767, 36.503192, 120],
    type: "jinggai",
  },
  {
    name: "三川口开发区",
    value: [103.91405, 36.379043, 120],
    type: "jinggai",
  },
  {
    name: "清水小学",
    value: [104.243746, 35.878103, 120],
    type: "jinggai",
  },
  {
    name: "中国石油",
    value: [104.300231, 35.801913, 120],
    type: "jinggai",
  },
  {
    name: "忠和中学",
    value: [103.810961, 36.235506, 120],
    type: "jinggai",
  },
  {
    name: "轩胜润邸",
    value: [103.804277, 36.117282, 120],
    type: "jinggai",
  },
  {
    name: "韩家河工业区",
    value: [103.773294, 36.035363, 120],
    type: "jinggai",
  },
];

// 显示加载动画
myChart.showLoading();
$.getJSON(uploadedDataURL, null, function (data) {
  echarts.registerMap("lanzhou", data);
  myChart.hideLoading();
  var geoCoordMap = {
    永登县: [103.250918, 36.603474],
    皋兰县: [103.879893, 36.389661],
    红古区: [103.110536, 36.277516],
    西固区: [103.522302, 36.126722],
    安宁区: [103.686572, 36.1243],
    城关区: [103.876381, 36.07365],
    七里河区: [103.771036, 35.965633],
    榆中县: [104.232869, 35.993455],
  };
  var data1 = [
    {
      name: "永登县",
      value: 199,
    },
    {
      name: "皋兰县",
      value: 39,
    },
    {
      name: "红古区",
      value: 152,
    },
    {
      name: "西固区",
      value: 152,
    },
    {
      name: "安宁区",
      value: 152,
    },
    {
      name: "城关区",
      value: 152,
    },
    {
      name: "七里河区",
      value: 152,
    },
    {
      name: "榆中县",
      value: 152,
    },
    {
      name: "中建大厦",
      value: 152,
    },
  ];
  var max = 480,
    min = 9;
  var maxSize4Pin = 100,
    minSize4Pin = 20;

  var convertData = function (data) {
    var res = [];
    for (var i = 0; i < data.length; i++) {
      var geoCoord = geoCoordMap[data[i].name];
      if (geoCoord) {
        res.push({
          name: data[i].name,
          value: geoCoord.concat(data[i].value),
        });
      }
    }
    return res;
  };

  option = {
    backgroundColor: "#020933",
    tooltip: {
      trigger: "item",
      formatter: function (params) {
        if (typeof params.value[2] == "undefined") {
          return params.name + " : " + params.value;
        } else {
          return params.name + " : " + params.value[2];
        }
      },
    },
    legend: {
      orient: "vertical",
      id: 1,
      y: "bottom",
      x: "right",
      itemWidth: 15,
      data: [
        {
          name: "垃圾",
          icon: "image://",
        },
        {
          name: "供水管道",
          icon: "image://",
        },
        {
          name: "城市绿地",
          icon: "image://",
        },
        {
          name: "天燃气",
          icon: "image://",
        },
        {
          name: "井盖",
          icon: "image://",
        },
      ],
      textStyle: {
        color: "#fff",
      },
    },
    geo: {
      show: true,
      map: "lanzhou",
      label: {
        normal: {
          show: false,
        },
        emphasis: {
          show: false,
        },
      },
      zoom: 1.2,
      roam: true,
      itemStyle: {
        normal: {
          areaColor: "transparent",
          borderColor: "#3fdaff",
          borderWidth: 2,
          shadowColor: "rgba(63, 218, 255, 0.5)",
          shadowBlur: 30,
        },
        emphasis: {
          areaColor: "#2B91B7",
        },
      },
    },
    series: [
      {
        type: "map",
        map: "lanzhou",
        geoIndex: 0,
        aspectScale: 0.75, //长宽比
        showLegendSymbol: false, // 存在legend时显示
        label: {
          normal: {
            show: false,
          },
          emphasis: {
            show: false,
            textStyle: {
              color: "#fff",
            },
          },
        },
        roam: true,
        itemStyle: {
          normal: {
            areaColor: "#031525",
            borderColor: "#3B5077",
          },
          emphasis: {
            areaColor: "#2B91B7",
          },
        },
        animation: false,
        data: data,
      },
      // 图标的位置
      {
        name: "Top 5",
        type: "effectScatter",
        coordinateSystem: "geo",
        data: convertData(
          data1.sort(function (a, b) {
            return b.value - a.value;
          })
        ),
        symbolSize: 12,
        showEffectOn: "render",
        rippleEffect: {
          brushType: "stroke",
        },
        hoverAnimation: true,
        label: {
          normal: {
            formatter: "{b}",
            position: "right",
            show: true,
          },
        },
        itemStyle: {
          normal: {
            color: "#05C3F9",
            shadowBlur: 10,
            shadowColor: "#05C3F9",
          },
        },
        zlevel: 1,
      },
      {
        name: "垃圾",
        type: "scatter",
        coordinateSystem: "geo",
        data: gubageArr,
        symbol:
          "image://",
        symbolSize: function (val) {
          return val[2] / 7.5;
        },
        label: {
          normal: {
            show: false,
            formatter: function (params) {
              // console.log(params);
              return params.name;
            },
            position: "right",
            color: "#fff",
            fontSize: "8",
          },
          emphasis: {
            show: false,
          },
        },
        itemStyle: {
          normal: {
            color: "#4bbbb2",
            borderWidth: 2,
            borderColor: "#b4dccd",
          },
        },
      },
      {
        name: "供水管道",
        type: "scatter",
        coordinateSystem: "geo",
        data: guanwang,
        symbol:
          "image://",
        symbolSize: function (val) {
          return val[2] / 7.5;
        },
        label: {
          normal: {
            show: false,
            formatter: function (params) {
              // console.log(params);
              return params.name;
            },
            position: "right",
            color: "#fff",
            fontSize: "8",
          },
          emphasis: {
            show: false,
          },
        },
        itemStyle: {
          normal: {
            color: "#ea6347",
            borderWidth: 2,
            borderColor: "#f4b391",
          },
        },
      },
      {
        name: "城市绿地",
        type: "scatter",
        coordinateSystem: "geo",
        data: lvdi,
        symbol:
          "image://",
        symbolSize: function (val) {
          return val[2] / 7.5;
        },
        label: {
          normal: {
            show: false,
            formatter: function (params) {
              // console.log(params);
              return params.name;
            },
            position: "right",
            color: "#fff",
            fontSize: "8",
          },
          emphasis: {
            show: false,
          },
        },
        itemStyle: {
          normal: {
            color: "#00ff00",
            borderWidth: 2,
            borderColor: "#55E355",
          },
        },
      },
      {
        name: "天燃气",
        type: "scatter",
        coordinateSystem: "geo",
        data: ranqi,
        symbol:
          "image://",
        symbolSize: function (val) {
          return val[2] / 7.5;
        },
        label: {
          normal: {
            show: false,
            formatter: function (params) {
              // console.log(params);
              return params.name;
            },
            position: "right",
            color: "#fff",
            fontSize: "8",
          },
          emphasis: {
            show: false,
          },
        },
        itemStyle: {
          normal: {
            color: "#FAFF1A",
            borderWidth: 2,
            borderColor: "#E3BC1F",
          },
        },
      },
      {
        name: "井盖",
        type: "scatter",
        coordinateSystem: "geo",
        data: jinggai,
        symbol:
          "image://",
        symbolSize: function (val) {
          return val[2] / 7.5;
        },
        label: {
          normal: {
            show: false,
            formatter: function (params) {
              // console.log(params);
              return params.name;
            },
            position: "right",
            color: "#fff",
            fontSize: "8",
          },
          emphasis: {
            show: false,
          },
        },
        itemStyle: {
          normal: {
            color: "#FF00FF",
            borderWidth: 2,
            borderColor: "#D33BD3",
          },
        },
      },
    ],
  };
  myChart.setOption(option);
});
